<!--
 * @Author: wangjh wangjiahui0710@163.com
 * @Date: 2024-05-21 09:54:00
 * @LastEditors: wangjh wangjiahui0710@163.com
 * @LastEditTime: 2024-07-22 15:55:03
 * @FilePath: \hn-fire-product-mobile\src\pages\home\index.vue
 * @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
-->
<script lang="ts" setup>
import { useUserStore } from '@/stores/user';
import { whManagerBsTbExamResultGetLastExamResultUsingPost } from '@/genapi/wh';
import { getEnumOptionsField, SYSTEM_USER_WORKER_TYPE_OPTIONS } from '@/config/enum-options';

defineOptions({ name: 'Certificate' });

const userStore = useUserStore();

const certificate = ref();
whManagerBsTbExamResultGetLastExamResultUsingPost({}).then((res) => {
	certificate.value = res.data;
});
</script>

<template>
	<div class="certificate">
		<div class="certificateTitle">化工园区在线安全教育考核证书</div>
		<br />
		<div class="certificateContent">
			<span>{{ userStore.userInfo?.systemUser?.realName }}：</span>
			<br />
			<span>在武汉化工园区在线安全教育培训中考核合格，特发此证</span>
		</div>
		<br />
		<br />
		<div class="certificateUnit">
			单位名称：{{ userStore.userInfo?.deptName ? userStore.userInfo?.deptName : '--' }}
		</div>
		<div class="certificateUnit">
			工种类别：{{
				getEnumOptionsField(
					SYSTEM_USER_WORKER_TYPE_OPTIONS,
					'label',
					userStore.userInfo?.systemUser?.workerType,
				) ?? '--'
			}}
		</div>
		<br />
		<div class="certificateUnit">
			有效期限：{{ certificate?.examDate }} 至 {{ certificate?.certificateExpireDate }}
		</div>
		<div class="certificateUnit">考核单位：武汉化工园区</div>
	</div>
</template>

<style scoped lang="scss">
.certificate {
	height: 460px;
	width: 100%;
	background-image: url('../assets/certificateBg.png');
	background-repeat: no-repeat;
	background-size: 100% 100%;
	padding: 100px 50px;
	.certificateTitle {
		width: 100%;
		text-align: center;
		font-size: 15px;
		font-weight: 600;
	}
	.certificateContent {
		width: 100%;
		font-size: 14px;
		font-weight: 600;
	}
	.certificateUnit {
		font-size: 12px;
	}
}
</style>
